<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<!DOCTYPE html>
<html>
<head>
<base href="${pageContext.request.contextPath }/">
<meta charset="UTF-8">
<title>信息中心</title>
<meta http-equiv="pragma" content="no-cache">
	<meta http-equiv="cache-control" content="no-cache">
	<meta http-equiv="expires" content="0">    
	<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
	<meta http-equiv="description" content="This is my page">
	<link rel="stylesheet" href="ht/layui/css/layui.css">
	<script type="text/javascript" src="ht/js/mouse.js"></script>
	<script type="text/javascript" src="ht/layui/layui.js" ></script>
	<script type="text/javascript">
		layui.use(['laypage', 'layer', 'table'], function(){
			 layer = layui.layer //弹层
			,laypage = layui.laypage //分页
			,table = layui.table //表格
			,$ = layui.$ //$是jquery对象
			
			table.render({
			    elem: '#news'
			    ,method:'post' //post请求
			    ,height: 390
			    ,url: 'newsaction!querybypage?typeid=<%=request.getParameter("typeid")==null?"0":request.getParameter("typeid") %>' //数据接口
			    ,page: true //开启分页
			    ,limit:3 //默认每页数据数
			    ,limits:[3,6,9,12,15] //分页列表
			    ,cols: [[ //表头
			       {field: 'newId', title: 'ID', width:'8%', sort: true, fixed: 'left'}
			      ,{field: 'newTitle', title: '名称', width:'18%'}
			      ,{field: 'newType', title: '类型', width:'8%',templet:"<div>{{d.candState=='0'?'汽车保养':'行业新闻' }}</div>"}
			      ,{field: 'newContent', title: '内容', width:'40%'}
			      ,{field: 'newTime', title: '时间', width:'13%'} 
			      ,{fixed: 'right', width: '13%', align:'center', toolbar: '#barDemo'}
			    ]]
			 });
			 
		
			 
			 //添加按钮
			 $('#btnAdd').click(function(){
				layer.open({
			         type: 2 //此处以iframe举例
			        ,title: '信息添加'
			        ,area: ['100%', '100%']
			        ,shade: 0.3 //遮罩0-1
			        ,maxmin: false //最大化最小化
			        ,content: 'ht/news_add.jsp'
			        ,zIndex: layer.zIndex //重点1
			 })
			 })
			 
			 table.on('tool(demo)', function(obj){ 
		    var data = obj.data //获得当前行数据
		    ,layEvent = obj.event; //获得 lay-event 对应的值
		   if(layEvent == 'del'){
			   layer.confirm('真的删除么', function(){
	            	 $.post('newsaction!dele.action?id='+data.newId,{},function(data){
				    	//data：-1 异常   0-编号已存在   1-成功
				    	if(data == -1){
				    		layer.msg('异常了！');					    		
				    	}else if(data == 0){
				    		layer.msg('删除失败！');
				    	}else{
				    		layer.msg('删除成功！');
				    		 obj.del(); //删除对应行（tr）的DOM结构
					       // layer.close(index);
				    		 layui.table.reload('news');
					        //向服务端发送删除指令
				    	}
				    })
				});
		    } else if(layEvent == 'edit'){
		      layer.open({
					         type: 2 //此处以iframe举例
					        ,title: '修改员工'
					        ,area: ['100%', '100%']
					        ,shade: 0.2 //遮罩0-1
					        ,maxmin: false //最大化最小化
					        ,content: 'newsaction!edit.action?id='+data.newId
					        ,zIndex: layer.zIndex //重点1
					    });
		    } 
		  });
			 
		});
	</script>
  </head>
  
  <body>
  	<div class="layui-inline" style="padding-top: 50px;">
      <div class="layui-inline">
	      <div class="layui-input-inline">
	        <button class="layui-btn layui-btn-danger" id="btnAdd">添  加</button>
	      </div>
	  </div>
    </div>
    <table class="layui-hide" id="news" lay-filter="demo"></table>
<script type="text/html" id="barDemo">
  <a class="layui-btn layui-btn-xs" lay-event="edit">编辑</a>
  <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除</a>
</script>
</body>
</html>